<?php
session_start();
include_once 'recursos/config.php';
include_once 'recursos/isMobile.php';

$cfg = new configuracion();
$dominio = $cfg->getG2uDominio()."/";

$isMobile = false;

if (isMobile()) {
    $isMobile = true;
}


?>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        
        <title> :: Gift 2 You :: <?=$_SESSION["g2uUserName"]?></title>
        
        <link rel="shortcut icon" type="image/ico" href="<?=$dominio?>images/vineta-globo.png" />
        <link type="text/css" href="<?=$dominio?>css/g2u.css" rel="stylesheet"  media="screen" />
        <link type="text/css" href="<?=$dominio?>css/tipsy.css" rel="stylesheet"  media="screen" />

        <link type="text/css" href="<?=$dominio?>css/jquery-ui.css" rel="stylesheet"  media="screen" />
        <link type="text/css" href="<?=$dominio?>css/jquery.mCustomScrollbar.css" rel="stylesheet"  media="screen" />
        
        <script lang="javascript" type="text/javascript" src="<?=$dominio?>js/jquery-1.9.1.js"></script>
        <script lang="javascript" type="text/javascript" src="<?=$dominio?>js/g2u.js"></script>
        <script lang="javascript" type="text/javascript" src="<?=$dominio?>js/tipsy.js"></script>
        <script lang="javascript" type="text/javascript" src="<?=$dominio?>js/jquery-ui.js"></script>
        
        <!-- SCROLL -->
        <script lang="javascript" type="text/javascript" src="<?=$dominio?>js/jquery.mCustomScrollbar.js"></script>


        
        <script>
            $(function() {
                $("#tabs").tabs();
            });
            
            $("#capaFriendList").mCustomScrollbar({
                    theme:"dark"
            });
        </script>

        
                <script>
          window.fbAsyncInit = function() {
          FB.init({
            appId      : '1398829387019074',
            channelUrl : '//g2u.com.pe/channel.html',
            status     : true,
            cookie     : true,
            xfbml      : true  
          });

            FB.Event.subscribe('auth.authResponseChange', function(response) {
                if (response.status === 'connected') {
                    //show button friends from fb
                }
            });

          };

          (function(d){
            var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
            if (d.getElementById(id)) {return;}
            js = d.createElement('script'); js.id = id; js.async = true;
            js.src = "//connect.facebook.net/en_US/all.js";
            ref.parentNode.insertBefore(js, ref);
          }(document));

        </script>
        
    </head>
    <body>
        <table cellpadding="0" cellspacing="0" style="width: 100%; height: 100%; border-color: lightgray;" border="0">
            <tr>
                <td style="width: 20%; vertical-align: top;  ">
                    <div>
                        <center>
                            <img src="images/logo.png"/>
                        </center>
                    </div>

                    <div>
                        <center>
                            <img id="ppicPortal" src="<?=$_SESSION["g2uProfilePic"]?>" />
                            <img src="images/png/salir.png" style="cursor: pointer;" onclick="logOut();"  width="18px" />
                            <br/>        
                            <?=$_SESSION["g2uFirstName"]?>
                        </center>
                    </div>
                    
                    <div id="menu">
                        <? include_once 'menu.php'; ?>
                    </div>
                    
                </td>
                <td style="width: 80%; vertical-align: top; padding-right: 50px; " >
                    <!--<div id="head">
                            <b></b>
                    </div>-->
                    <div id="fb-root"></div>
                    
                    <div id="contentBody">
                        
                        <div id="friendHead">
                            Amigos
                        </div>
                        
                        <div id="friendBody">
                            <div id="friendInnerBody">

                                <div id="capaFriendListTabs" style="display: none;">
                                    <div id="tabs">
                                        <ul>
                                          <li><a href="#todos"><img src="images/png/amigos.png" style="border: none;" height="24px"/> Amigos</a></li>
                                          <li><a href="#solicitudes"><img src="images/png/amigos.png" style="border: none;" height="24px"/> Solicitudes de Amistad</a></li>
                                          <li><a href="#agregar"><img src="images/png/agregar_amigos.png" style="border: none;" height="24px"/> Agregar Amigos</a></li>                                          
                                        </ul>
                                        
                                        <div id="todos" style="height: 450px; overflow: auto;">
                                            <? 
                                            include_once 'vista/vista.friends.php';
                                            ?>
                                        </div>
                                        
                                        <div id="solicitudes" style="height: 450px; overflow: auto;">
                                            <? 
                                            include_once 'vista/vista.friends.fbinvitation.php';
                                            ?>
                                        </div>
                                        
                                        <div id="agregar">
                                          <p>
                                              <? if ($isMobile){ ?>
                                              <input type="button" onclick="FB_GET_FRIENDS_MOVIL(); $('#campo').show();" value="AMIGOS DEL FACEBOOK" />
                                              <input type="text" id="campo" name="campo" style="display: none" onkeyup="filtrar();" />
                                              <? } else { ?>
                                              <input type="button" onclick="FB_GET_FRIENDS();" value="AMIGOS DEL FACEBOOK" />
                                              <? } ?>
                                          </p>
                                          <div id="capaFriendList" style="height: 400px; overflow: auto;">
                                                <? 
                                                    //include_once 'vista/vista.friends.fbinvitation_ext.php';
                                                ?>
                                          </div>
                                        </div>
                                     </div>
                                 </div>
                       
                            </div>
                        </div>
                    </div>
                </td>
            </tr>
        </table>

    <script type="text/javascript">
          
        var FBfriends = "";
          
        function loadTipsy(){
            $('img').tipsy({html: true });
        }
    
        function sortByKey(array, key) {
            return array.sort(function(a, b) {
                var x = a[key]; var y = b[key];
                return ((x < y) ? -1 : ((x > y) ? 1 : 0));
            });
        }
       
        function FB_GET_FRIENDS(){
            
            FB.ui({
                    method: 'apprequests',
                    message: 'Únete a la manera más fácil de compartir emociones!.'
                }, function(data){
                    $.post( "saveUserAppReq/"+data.request+"/"+data.to+"" , function(data2){
                        
                        data3 = data.to;
                        data3 = data3+"";
                        data3 = data3.replace("[","");
                        data3 = data3.replace("]","");
                        //to: data3,
                        window.location.href = '<?=$cfg->getG2uDominio()?>/amigos';
                    });
                });

                
        }
        
        function FB_GET_FRIENDS_MOVIL(){

            FB.getLoginStatus(function(res){
                if (res.status == "connected") {
                    FB.api('/me/friends', function(friends){

                    friends.data = sortByKey(friends.data, 'name');
                        
                    FBfriends = friends;
                    
                    table = '<table width="100%" border="0" cellpadding="0" cellspacing="0">';
                    table += '<tr>';
                    contador = 1;
                    contador2 = 1;
                    
                    
                    for(friend in friends.data){
                        if (contador2<=40){
                            id = friends.data[friend].id;
                            name = friends.data[friend].name;
                            src = "http://graph.facebook.com/"+id+"/picture";
                            
                            table += '<td width="25%">';
                                table += '<table width="100%" heigth="100%" border="0" cellpadding="0" cellspacing="0">';
                                    table += '<tr>';
                                        table += '<td rowspan="2" width="50px">';
                                            table += '<img src="'+src+'" alt="'+name+'" title="'+name+'" />';
                                        table += '</td>';
                                        table += '<td>';
                                            table += '<b>'+name+'</b>';
                                        table += '</td>';
                                    table += '</tr>';
                                    table += '<tr>';
                                        table += '<td>';
                                            table += '<span id="'+id+'" onclick="enviarPostFacebook(\''+id+'\')">Agregar</span>';
                                        table += '</td>';
                                    table += '</tr>';
                                table += '</table>';
                            
                            table += '</td>';
                            
                            if(contador == 4){
                                table += '</tr>';
                                table += '<tr>';
                                contador = 0;
                            }
                            contador++;
                            contador2++;
                        }
                    }
                    table += '</tr>';
                    table += '</table>';
                    $("#capaFriendList").html(''+table+'');
                        loadTipsy();
                    });
                   
                }else{
                    alert("Parece que no has iniciado sesion en Facebook.");
                }
            });
            
            $("#capaFriendList").mCustomScrollbar({
                    theme:"dark"
            });
        }
        
        function filtrar(){
        
            campo = $("#campo").val();
        
            table = '<table width="100%" border="0" cellpadding="0" cellspacing="0">';
            table += '<tr>';
            contador = 1;
                for(friend in FBfriends.data){
                    id = FBfriends.data[friend].id;
                    name = FBfriends.data[friend].name;
                    src = "http://graph.facebook.com/"+id+"/picture";

                    if (campo.toUpperCase() == name.substring(0,campo.length).toUpperCase()){
                        table += '<td width="25%">';
                            table += '<table width="100%" heigth="100%" border="0" cellpadding="0" cellspacing="0">';
                                table += '<tr>';
                                    table += '<td rowspan="2" width="50px">';
                                        table += '<img src="'+src+'" alt="'+name+'" title="'+name+'" />';
                                    table += '</td>';
                                    table += '<td>';
                                        table += '<b>'+name+'</b>';
                                    table += '</td>';
                                table += '</tr>';
                                table += '<tr>';
                                    table += '<td>';
                                        table += '<span id="'+id+'" onclick="enviarPostFacebook(\''+id+'\')">Agregar</span>';
                                    table += '</td>';
                                table += '</tr>';
                            table += '</table>';

                        table += '</td>';

                        if(contador == 4){
                            table += '</tr>';
                            table += '<tr>';
                            contador = 0;
                        }
                        contador++;
                    }
                }

            table += '</tr>';
            table += '</table>';

            $("#capaFriendList").html(''+table+'');
                loadTipsy();
                    
        
        }
        
        function enviarPostFacebook(id){
            FB.ui({
                method: 'feed',
                to: id,
                name: 'G2U',
                caption: 'La manera mas facil de compartir',
                description: (
                   'Te he enviado una solicitud de amistad!'
                ),
                link: '<?=$cfg->getG2uDominio()?>',
                picture: '<?=$cfg->getG2uDominio()?>/images/logo.png'
               },
               function(response) {
                 if (response && response.post_id) {
                     $.post( "saveUserAppReq/"+id+"/"+id+"" , function(data2){
                         alert("Se publico el post");
                     });
                 }
               }
             );
        }

        function acceptFriend(id){
            $.post( "confirmFriendship/fb/"+id+"" , function(data){
                alert("Solicitud confirmada!");
                window.location.href = '<?=$cfg->getG2uDominio()?>/amigos';
            });
        }
        
        $(document).ready(function(){
            $("#capaFriendListTabs").ready(function(){
                $("#capaFriendListTabs").fadeIn();
            });
        })
        </script>
        
    </body>
</html>